// components/horizontal-slider/index.js
Component({
    /**
     * 组件的属性列表
     */
    properties: {
        blockColor: {
            type: String,
            value: "#ffffff",
        },
        blockSize: {
            type: Number,
            value: 28,
        },
        activeColor: {
            type: String,
            value: "#1aad19",
        },
        max: {
            type: Number,
            value: 100,
        },
        min: {
            type: Number,
            value: 0,
        },
        step: {
            type: Number,
            value: 1,
        },
        value: {
            type: Number,
            value: 0,
        },
        disabled: {
            type: Boolean,
            value: false,
        },
        showValue: {
            type: Boolean,
            value: false,
        },
    },

    /**
     * 组件的初始数据
     */
    data: {
        totalLeft: null,
        totalLength: null,
        currentValue: 0,
    },

    ready() {
        this.queryWidth();
    },

    /**
     * 组件的方法列表
     */
    methods: {
        setCurrent(e) {
            this.setData({
                currentValue: e,
            })
        },
        queryWidth: function() {
            wx.createSelectorQuery()
                .in(this)
                .select(".slider-container")
                .boundingClientRect((res) => {
                    console.log(res);
                    this.setData({
                        totalLeft: res.left,
                        totalLength: res.right,
                    });
                })
                .exec();
        },
    },
});